<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
<title>炫詳情</title>
<link rel="stylesheet" type="text/css" href="../../css/aui.min.css"/>

<style>
			/*重新定义*/
			.aui-list-view:after {
				border-top: 0;
			}
			.aui-list-view:before {
				border-top: 0;
			}
			.aui-user-view-cell:after {
				left: 0;
			}
			.rightIcon {
				position: absolute;
				right: 2.5%;
			}
			.h1 {
				height: 1px;
				background: black;
			}
			/*自定义*/
			.colorBlue {
				color: #00ABFD;
			}
			.content {
				font-size: 14px;
				color: #333333;
			}
			.otherinfo p {
				font-size: 12px;
				margin-bottom: 5px;
			}
			.icon {
				margin-left: 8px;
			}
			.coverDiv {
				width: 100%;
				height: 100%;
				position: absolute;
				top: 0;
				border: 1px solid white;
				background: gray;
				opacity: 0.5;
				z-index: 10;
				display: none;
			}
			.rightIcon {
				width: 16px;
				height: 16px;
			}
			.shareDiv {
				background: white;
				border: 1px solid black;
				position: absolute;
				bottom: 0px;
				width: 100%;
				z-index: 20;
				display: none;
			}
			.shareDiv ul {
				width: 90%;
				margin-left: 5%;
			}
			.shareDiv ul li {
				float: left;
				list-style: none;
				width: 20%;
				margin: 0px 2.5% 0px 2.5%;
				text-align: center;
				height: 110px;
			}
			.shareDiv img {
				width: 90%;
				height: 60px;
				margin-top: 10px;
			}
			.cancel {
				font-size: 20px;
				text-align: center;
				line-height: 40px;
				height: 40px;
			}
			.visitors {
				margin-top: 5px;
				width: 95%;
				margin-left: 2.5%;
				display: none;
			}
			.visitors img {
				margin-right: 1%;
				width: 60px;
				height: 60px;
				border-radius: 50%;
			}
			#news {
				background-color: #f2f2f2;
				overflow: scroll;
			}
			#news ul li {
				overflow: hidden;
				border-bottom: 1px solid #d9d9d9;
			}
			#news ul li a {
				display: block;
				overflow: hidden;
				position: relative;
				padding: 10px 10px;
			}
			#news ul li a.active {
				background-color: #d9e4e9;
			}
			#news ul li img {
				float: left;
				width: 45px;
				height: 45px;
				border-radius: 4px;
			}
			#news .content {
				width: 75%;
				margin-left: 60px;
				overflow: hidden;
			}
			#news .content h2, #news h2 {
				width: 60%;
				font-size: 20px;
				font-weight: 800;
				height: 30px;
				white-space: nowrap;
				text-overflow: ellipsis;
			}
			#news .content p {
				width: 100%;
				color: #999;
				overflow: hidden;
				max-height: 80px;
				font-size: 12px;
				word-wrap: break-word;
			}
			
			.counts, .time {
				position: absolute;
				font-size: 14px;
				right: 2%;
			}
			.title {
				width: 120px;
				height: 15px;
				overflow: hidden;
			}
			.time {
				display: inline-block;
				height: 15px;
			}
			.foot {
				width: 100%;
				height: 50px;
				background: #eeeeee;
				line-height: 50px;
			}
			.foot img {
				position:relative;
				left:2.5%;
				right:2.5%;
				top:10px;
			}
			.foot input[type="text"] {
				width: 60%;
				height: 40px;
				font-size: 20px;
				background: white;
				margin-left:4.5%;
			}
			.foot input[type="button"] {
				height: 40px;
				width: 20%;
				font-size: 20px;
				color: white;
				background: #00ABFD;
				position: absolute;
				right: 2.5%;
				bottom: 5px;
			}
			#tanChu,#tanChu1,#tanChu2,#tanChu3,#tanChu4,#tanChu5{
			border:1px solid black;
			width: 80%;
			height: 100px;
			position: absolute;
			left: 50%;
			margin-left: -40%;
			top: 50%;
			margin-top: -50px;
			background:white;
			display: none;
		}
		#tanChu_btn,#tanChu_btn1,#tanChu_btn2,#tanChu_btn3,#tanChu_btn4,#tanChu_btn5{
			display: block;
			margin-top: 20px;
			margin-left:40%;
			background:#00abfd;
			width:50px;
			height:20px;
		}
		#tanChu p,#tanChu1 p,#tanChu2 p,#tanChu3 p,#tanChu4 p,#tanChu5 p{
			height: 30px;
			line-height: 30px;
			text-align: center;
			margin-top: 20px;
		}
		</style>
<script src="../../script/jquery-1.10.2.min.js"></script>
<script src="../../script/common.js"></script>
</head>
<body>
<div id="tanChu1">
	<p>数据请求失败！</p>
	<input type="button" value="确定" id="tanChu_btn1">
</div>
<div>
<div id="loadIng_startStop" style="width: 100%;height: 100%;z-index: 1000;display:none;position: absolute;">
       <div class="div_loding_img">
		数据加载中
	</div>
    </div>
<header class="aui-bar aui-bar-nav aui-bar-yunzo" id="aui-header" style="background: #00abfd;">
			
			<table style="width: 100%;height: 100%;text-align: center"><tr><td id="partName">
			<a  id="back" style="position: absolute;left:2%;" href="javascript:window.history.go(-1);"> <span class="aui-iconfont aui-icon-left" ></span> </a>
          炫详情
        </td></tr></table>
			<a class="aui-iconfont aui-icon-menu aui-pull-right"></a>
		</header>
		<ul id="txtNewsList"></ul>
		</div>
		<div class="coverDiv" id="coverDiv"></div>
		<div class="shareDiv" id="shareDiv">
			<ul>
				<li><img src="../../image/home/xuan/friend.png">
					<p>
						朋友圈
					</p>
				</li>
				<li><img src="../../image/home/xuan/tencent.png">
					<p>
						腾讯微博
					</p>
				</li>
				<li><img src="../../image/home/xuan/weibo.png">
					<p>
						新浪微博
					</p>
				</li>
				<li><img src="../../image/home/xuan/weixin.png">
					<p>
						微信好友
					</p>
				</li>
				<li><img src="../../image/home/xuan/email.png">
					<p>
						邮件
					</p>
				</li>
			</ul>
			<div class="h1"></div>
			<div class="cancel" onclick="cancelShare()">
				取消
			</div>
		</div>
        <!--加载loading功能-->
        <div id="loadIng_startStop" style="width: 100%;height: 100%;position: absolute;z-index: 1000;display: none;">
            <img src="../../image/my/loading_more.gif" style="width: 20%;position: absolute;left: 50%;margin-left: -10%;top:50%;margin-top: -10%;">
        </div>
		<script type="text/javascript">
            /*loading加载转圈*/
            sTart_Stop();

		var showid;
		var img;
		var name;
		var cares;
		var time;
		var title;
		var content;
		var tomid;
		var types;
		var coverDiv;
		var shareDiv;
		var did;
		var n = 0;
		var x = 0;
		var post;
		var obj;
		
		$(document).ready(function(){
			showid = getUrlParam("showid");
			img = getUrlParam("img");
			name = getUrlParam("name");
			cares = getUrlParam("cares");
			time = getUrlParam("time");
			title = getUrlParam("title");
			content = getUrlParam("content");
			tomid = getUrlParam("tomid");

			coverDiv = $('#coverDiv');
			shareDiv = $('#shareDiv');
			obj = $('#txtNewsList');
			did=initdata.get('showmeinfo');
			post=basedata('showmeinfo')+ '&showid=' + showid;
			getinfodata(post);
		});
		sTart_Stop();
		function getinfodata(post)
		{
			ajaxcocRequest('../../../api/group/getshowmeinfobyAction', 'POST', post, function(msg) {
				obj.html("");
				if (msg.code == 100) {
					var html = '';
					var thisItem = msg.datum;
					html += '<li class="aui-list-view">';
					html += '<div class="aui-user-view-cell aui-img"><img class="aui-img-object aui-pull-left" src="' + img + '">';
					html += '<div class="aui-img-body">';
					html += '<span>' + name + '<em class="colorBlue">' + thisItem.n0 + '</em><em>关注热度</em></span>';
					html += '<p class="aui-ellipsis-1">' + time + '</p>';
					html += '</div>';
					html += '</div>';
					html += '<div class="aui-padded-10 content">' + title + '</div><div class="aui-line-x"></div>';
					html += '<ul class="aui-thumb-view" >';
					for (var j = 0; j < content.split(',').length; j++) {
						html += '<li class="aui-list-view-cell aui-img aui-col-xs-4" onclick="imagezoom(\'' + content.split(',')[j] + '\')"><img class="aui-img-object" src="' + content.split(',')[j] + '"></li>';
					}
					html += '</ul>';
					html += '<div class="aui-line-x"></div>';
					html += '<div class="aui-col-xs-12  otherinfo">';
					html += '<div class="aui-padded-10"><div style="float:right;right:2.5%;">';
					html += '<img class="icon" src="../../image/home/busess/seleveLetter.png" onclick="chatme(\'' + tomid + '\')">';
					html += '<img  class="icon" onclick="showDiv()" src="../../image/home/busess/share16.png"></div></div>';
					html += '<div class="aui-line-x"></div>';
					html += '<div class="aui-padded-10"  onclick="showImg()">共有<span class="colorBlue">' + thisItem.n6.length + '</span>人看过你<img src="../../image/icon/downIcon.png" id="arrows" class="rightIcon"></div>';
					html += '<div class="aui-line-x"></div><div class="visitors" id="visitors">';
					
					if (thisItem.n6.length != 0) {
						for (var i = 0; i < thisItem.n6.length; i++) {
							var browsImg=thisItem.n6[i];
							//alert(browsImg[i].n0)
							html += '<img onclick="opeinmemberinfo(\'' + browsImg.n0 + '\')" src="' + browsImg.n1 + '">';
						}
					}
					html += '</div>';
					html += '<div class="aui-line-x" style="display:none;" id="underLine"></div>';
					html += '<div class="aui-padded-10" onclick="showComment()">共有<span class="colorBlue" id="commentCounts">' + thisItem.n4 + '</span>条评论<img src="../../image/icon/downIcon.png" class="rightIcon" id="arrows1"></div>';
					html += '<div class="aui-line-x"></div>';
					html += '<div id="commentDiv" style="display:none;">';
					html += '<div id="news">';
					html += '<ul  id="commentList"></ul>';
					html += '</div>';
					html += '<div class="foot">';
					html += '<img src="../../image/home/xiaolian.png">';
					html += '<input type="text" id="commentCot">';
					html += '<input type="button" value="发送" onclick="upComment()">';
					html += '</div></div><div class="aui-line-x" id="commentLine" style="display:none;"></div>';
					html += '</li></div>';
					
					obj.html(html);
				} else {
					obj.html('<div class="defaltes"><span>您查询的信息为空！</span></div>');
				}
			});
		}
		function showDiv() {
			//coverDiv.style.display = "block";
			//shareDiv.style.display = "block";
			alert("功能暂未开通");
		}

		function cancelShare() {
			coverDiv.hide();
			shareDiv.hide();
		}

		function showImg() {
			if (n == 0) {
				$('#visitors').show();
				$('#underLine').show();
				$('#arrows').attr("src","../../image/icon/upIcon.png");
				n = 1;
			} else {
				$('#visitors').hide();
				$('#underLine').hide();
				$('#arrows').attr("src","../../image/icon/downIcon.png");
				n = 0;
			}
		}

		function showComment() {
		if($mtype=="guest")
		{
			alert("游客模式无权限使用[评论]功能！");
		}else{
			if (x == 0) {
				$('#arrows1').attr("src","../../image/icon/upIcon.png");
				var obj = $('#commentList');
				$('#commentDiv').show();
				$('#commentLine').show();
				obj.html('<img src="../../image/loading_more.gif" alt="loading.." />数据加载中...');
				ajaxcocRequest('../../../api/getbussdatareviewbypidforlist', 'POST',basedata('showmeinfo')+"&pid="+showid+"&pagesize=5", function(msg) {
					if (msg.code==100) {
							var html = '';
							for (var i = 0, len = msg['data'].length; i < len; i++) {
								var thisItem = msg['data'][i];
								html += '<li><a tapmode="active" onclick="opeinmemberinfo(\'' + thisItem.n2 + '\')"><div class="logo"><img src="' + thisItem.n3 + '"/></div><div class="content"><h2 class="title">' + thisItem.n1 + '<span class="time">' + thisItem.n5 + '</span></h2><p>' + thisItem.n4 + '</p></div> </a></li>'
							}
							obj.html(html);
					} else {
						obj.html("没有数据！"+JSON.stringify(msg));
					}
				})
				x=1;
			} else {
				$('#commentDiv').hide();
				$('#commentLine').hide();
				$('#arrows1').attr("src","../../image/icon/downIcon.png");
				x=0;
			}
		}
}
		//提交评论函数
		function upComment() {
			var commentCot = $("#commentCot").val();
			var param = {"mid":$mid,"groupid":$groupid,"did":did,"pid":pid,"cntvalue":commentCot};
			ajaxCoCRequest('../../../api/sendreviewbymid', 'POST', param, function(msg) {
				if (msg.code==100) {
					$("#commentCot").val("");
					x=0;
					$('#commentCounts').innerText++;
					showComment();
				} else {
					alert("评论失败！");
				}
			})
		}
		function opeinmemberinfo(mid)
		{
			
		}
	</script>
</body>
</html>